<template>
	<view class="search-page" :style=" typeList[typeIndex].type == 'shop' ? 'padding-top:88px' : ''">
		<view class="header fixed">
			<view class="search-wrapper">
				<view class="search-box ">
					<text class="iconfont icon-sousuo"></text>
					<input class="input" :placeholder="placeholder" placeholder-style="color:#999;" confirm-type="search" :value="inputValue" @input="input" @confirm="search('btn')"></input>
					<text class="iconfont icon-cha1" v-if="inputValue != ''" @tap="clearInput"></text>
				</view>
				<view class="btn" :style="'color:' + mobile_head_color + ';'" @tap="search('btn')"><lang keywords="搜索"></lang></view>
			</view>
			<view class="type-list">
				<view class="item" :style="index == typeIndex ? activeStyle : ''" v-for="(item, index) in typeList" @tap="selectType(index)">{{ item.name }}</view>
			</view>
		</view>

		<view class="shop-list" v-if="typeList[typeIndex].type == 'shop' && shopList && shopList.list.length > 0">
			<view class="shop-item"  v-for="(shop, i) in shopList.list" :key="shop.store_id" @tap="goShop(i)">
				<view class="close-mask" v-if="shop.is_close == 1"></view>
				<view class="img-wrapper">
					<image class="img" :src="shop.image" mode="aspectFill" :lazy-load="true"></image>
					<view class="close" v-if="shop.is_close == 1"><lang keywords="休息中" chineseTxt="休息中"></lang></view>
					<view class="tag" v-if="shop.isverify == 1"><lang keywords="已认证" chineseTxt="已认证"></lang></view>
				</view>

				<view class="content-box">
					<view class="name">{{ shop.name }}</view>
					<view class="line">
						<view class="score-box">
							<lang v-if="shop.is_self == 1" class="self-support" keywords="自营" chineseTxt="自营"></lang>
							<text class="iconfont icon-star"></text>
							<text class="score">{{ shop.star }}</text>
							<block v-if="shop.is_new == 1 || shop.month_sale_count > 0">
								<block v-if="shop.is_new == 1"><lang keywords="新店入驻" chineseTxt="新店入驻"></lang></block>
								<block v-else><lang keywords="已售X1" :X1="shop.month_sale_count" :chineseTxt="'已售' + shop.month_sale_count"></lang></block>
							</block>
						</view>
						<view class="express-box">
							<text class="other" :style="'background:' + mobile_head_color + ';'" v-if="shop.deliver_type == 0 || shop.deliver_type == 3">
								{{ shop.deliver_name }}
							</text>
							<block v-if="shop.delivery && (shop.deliver_type == 1 || shop.deliver_type == 4)">
								<lang class="self" :style="'color:' + mobile_head_color + ';border:1rpx solid ' + mobile_head_color + ';'" keywords="商家配送" chineseTxt="商家配送"></lang>
							</block>
							<block v-if="shop.delivery && shop.deliver_type == 5">
								<lang class="self" :style="'color:' + mobile_head_color + ';border:1rpx solid ' + mobile_head_color + ';'" keywords="快递配送" chineseTxt="快递配送"></lang>
							</block>
						</view>
					</view>
					<view class="line pt5 po-re" v-if="shop.deliver_type != 2">
						<view class="gather-box">
							<lang keywords="起送" chineseTxt="起送"></lang>
							<text>{{ currency + shop.delivery_price }}</text>
							<block v-if="config.config.shop_show_delivermoney">
								<text class="iconfont icon-line"></text>
								<lang keywords="配送" chineseTxt="配送"></lang>
								<text>{{ currency + shop.delivery_money }}</text>
							</block>
						</view>
						<view class="gather-box">
							<text v-if="shop.deliver_type != 2">{{ shop.delivery_time + shop.delivery_time_type }}</text>
							<text class="iconfont icon-line" v-if="shop.deliver_type != 2"></text>
							<text>{{ shop.range }}</text>
						</view>
					</view>
					<view class="goods-info">
						<view class="discount-icon">
							<view
								class="self"
								:style="'color:' + mobile_head_color + ';border-color:' + mobile_head_color + ';'"
								v-if="shop.deliver_type == 2 || shop.deliver_type == 3 || shop.deliver_type == 4"
							>
								<lang keywords="门店自提" chineseTxt="门店自提"></lang>
							</view>
							<view :class="item.type" v-for="(item, index2) in shop.coupon_list" :key="index2">{{ item.text }}</view>
						</view>
						<view :class="(shop.goods_list.length > 2 ? 'active' : '') + ' ' + (shop.showMore ? 'active-more' : '')">
							<view
								class="goods"
								v-for="(item, index2) in shop.goods_list"
								:key="index2"
								@click.stop="goGoodsDetail(item.store_id,item.goods_id)"
							>
								<image class="img" :src="item.image"></image>
								<view class="desc">
									<view class="name"><rich-text :nodes="item.search_name"></rich-text></view>
									<view class="num"><lang keywords="已售X1" :X1="item.sell_count" :unit="item.unit" :chineseTxt="'已售' + item.sell_count"></lang></view>
									<view class="price" v-if="item.sell_type != '2'">
										<view class="seckill_price" v-if="item.is_seckill == 1">
											<view class="discount_info"><text style="margin-right:12rpx;"><lang keywords="限时优惠" chineseTxt="限时优惠"></lang></text><lang keywords="X1折" :X1="item.seckill_discount" :chineseTxt="item.seckill_discount + '折'"></lang></view>
											<view class="">
												<text class="price">{{ currency + item.seckill_price }}</text>
												<text class="del-line">{{ currency + item.price }}</text>
											</view>
										</view>
										<view v-else>
											{{ currency + item.price }}
										</view>
									</view>
									<view class="price" v-else>{{ currency + item.unit_price }}<text class="unit">/斤</text></view>
								</view>
							</view>
						</view>

						<view class="show-more" v-if="shop.goods_list.length >= 3" @click.stop="showMoreGoods(i)">
							<view v-if="!shop.showMore">
								<lang keywords="查看其它X1个商品" :X1="shop.goods_list.length - 2" :chineseTxt="'查看其它'+ (shop.goods_list.length - 2) +'个商品'"></lang>
								<text class="iconfont icon-xiala"></text>
							</view>
							<view v-if="shop.showMore">
								<lang keywords="收起" chineseTxt="收起"></lang>
								<text class="iconfont icon-jiantou1"></text>
							</view>
						</view>
					</view>
				</view>
			</view>
		</view>
		
		<view class="group-list" v-if="typeList[typeIndex].type == 'group' && groupList && groupList.list.length > 0">
			<view class="sort-list">
				<view class="sort-item" :style="groupList.sortStr == '' ? ('color:' + mobile_head_color) : ''" @click="sortGroup('')">
					<lang keywords="默认排序" chineseTxt="默认排序"></lang>
					<text class="iconfont icon-arr-top" v-if="groupList.sortStr == ''"></text>
					<text class="iconfont icon-sanjiaoB" v-else></text>
				</view>
				<view class="sort-item" :style="groupList.sortStr == 'hot' ? ('color:' + mobile_head_color) : ''" @click="sortGroup('hot')">
					<lang keywords="销量最高" chineseTxt="销量最高"></lang>
					<text class="iconfont icon-arr-top" v-if="groupList.sortStr == 'hot'"></text>
					<text class="iconfont icon-sanjiaoB" v-else></text>
				</view>
				<view class="sort-item" :style="groupList.sortStr == 'price' ? ('color:' + mobile_head_color) : ''" @click="sortGroup('price')">
					<lang keywords="价格最低" chineseTxt="价格最低"></lang>
					<text class="iconfont icon-arr-top" v-if="groupList.sortStr == 'price'"></text>
					<text class="iconfont icon-sanjiaoB" v-else></text>
				</view>
			</view>
			<view class="shop-item"  v-for="(shop, i) in groupList.list" :key="shop.store_id" @tap="goUrl" :data-url="shop.url">
				<view class="img-wrapper">
					<image class="img" :src="shop.list_pic" mode="aspectFill" :lazy-load="true"></image>
				</view>
			
				<view class="content-box">
					<view class="name">{{ shop.s_name }}</view>
					<view class="line"><rich-text class="search-key ellipsis2" :nodes="shop.group_name"></rich-text></view>
					<view class="line">
						<view>
							<text class="price" :style="'color:' + mobile_head_color">{{currency + shop.price}}</text>
							<text class="old-price">{{currency + shop.old_price}}</text>
							<lang class="wx-discount" keywords="微信再减X1" :X1="shop.wx_cheap" unit="yuanSymbol" v-if="shop.wx_cheap > 0"></lang>
						</view>
						<view><lang keywords="已售" chineseTxt="已售"></lang><text>{{shop.sale_count}}</text></view>
					</view>
					<view class="discount-icon">
						<text class="icon" v-for="item in shop.field_info">{{item}}</text>
					</view>
				</view>
			</view>
		</view>
		
		<view class="meal-list" v-if="typeList[typeIndex].type == 'meal' && mealList && mealList.list.length > 0">
			<view class="sort-list">
				<view class="sort-item" :style="mealList.sortStr == '' ? ('color:' + mobile_head_color) : ''" @click="sortMeal('')">
					<lang keywords="默认排序" chineseTxt="默认排序"></lang>
					<text class="iconfont icon-arr-top" v-if="mealList.sortStr == ''"></text>
					<text class="iconfont icon-sanjiaoB" v-else></text>
				</view>
				<view class="sort-item" :style="mealList.sortStr == 'hot' ? ('color:' + mobile_head_color) : ''" @click="sortMeal('hot')">
					<lang keywords="销量最高" chineseTxt="销量最高"></lang>
					<text class="iconfont icon-arr-top" v-if="mealList.sortStr == 'hot'"></text>
					<text class="iconfont icon-sanjiaoB" v-else></text>
				</view>
				<view class="sort-item" :style="mealList.sortStr == 'price-asc' ? ('color:' + mobile_head_color) : ''" @click="sortMeal('price-asc')">
					<lang keywords="人均消费最低" chineseTxt="人均消费最低"></lang>
					<text class="iconfont icon-arr-top" v-if="mealList.sortStr == 'price-asc'"></text>
					<text class="iconfont icon-sanjiaoB" v-else></text>
				</view>
			</view>
			<view class="shop-item"  v-for="(shop, i) in mealList.list" :key="shop.store_id" @tap="goUrl" :data-url="shop.url">
				<view class="img-wrapper">
					<image class="img" :src="shop.image" mode="aspectFill" :lazy-load="true"></image>
					<view class="tag" v-if="shop.isverify == 1"><lang keywords="已认证"></lang></view>
				</view>
			
				<view class="content-box">
					<view class="name"><rich-text :nodes="shop.search_name"></rich-text></view>
					<view class="line"><view class="block-in ellipsis2">{{shop.txt_info}}</view></view>
					<view class="line">
						<view>
							<text class="price" :style="'color:' + mobile_head_color">{{currency + shop.mean_money}}</text>
							<lang keywords="（人均）"></lang>
						</view>
						<view><lang keywords="已售" chineseTxt="已售"></lang><text>{{shop.sale_count}}</text></view>
					</view>
				</view>
			</view>
		</view>
		
		<view class="appoint-list" v-if="typeList[typeIndex].type == 'appoint' && appointList && appointList.list.length > 0">
			<view class="sort-list">
				<view class="sort-item" :style="appointList.sortStr == '' ? ('color:' + mobile_head_color) : ''" @click="sortAppoint('')">
					<lang keywords="默认排序" chineseTxt="默认排序"></lang>
					<text class="iconfont icon-arr-top" v-if="appointList.sortStr == ''"></text>
					<text class="iconfont icon-sanjiaoB" v-else></text>
				</view>
				<view class="sort-item" :style="appointList.sortStr == 'appointNum' ? ('color:' + mobile_head_color) : ''" @click="sortAppoint('appointNum')">
					<lang keywords="预约最多" chineseTxt="预约最多"></lang>
					<text class="iconfont icon-arr-top" v-if="appointList.sortStr == 'appointNum'"></text>
					<text class="iconfont icon-sanjiaoB" v-else></text>
				</view>
				<view class="sort-item" :style="appointList.sortStr == 'price' ? ('color:' + mobile_head_color) : ''" @click="sortAppoint('price')">
					<lang keywords="价格最低" chineseTxt="价格最低"></lang>
					<text class="iconfont icon-arr-top" v-if="appointList.sortStr == 'price'"></text>
					<text class="iconfont icon-sanjiaoB" v-else></text>
				</view>
			</view>
			<view class="shop-item"  v-for="(shop, i) in appointList.list" :key="shop.store_id" @tap="goUrl" :data-url="shop.url">
				<view class="img-wrapper">
					<image class="img" :src="shop.list_pic" mode="aspectFill" :lazy-load="true"></image>
				</view>
			
				<view class="content-box">
					<view class="name"><rich-text :nodes="shop.search_name"></rich-text></view>
					<view class="line"><view class="block-in ellipsis2">{{shop.txt_info}}</view></view>
					<view class="line">
						<view>
							<text class="price" :style="'color:' + mobile_head_color">{{currency + shop.appoint_price}}</text>
							<lang class="wx-discount" v-if="shop.appoint_type != 0" keywords="上门" chineseTxt="上门"></lang>
							<lang class="wx-discount" v-else keywords="到店" chineseTxt="到店"></lang>
						</view>
						<view><lang keywords="已预约" chineseTxt="已预约"></lang><text>{{shop.appoint_sum}}</text></view>
					</view>
				</view>
			</view>
		</view>
		
		<view class="loading-txt" 
			v-if="(typeList[typeIndex].type == 'shop' && shopList && shopList.pageLoading) || 
					(typeList[typeIndex].type == 'group' && groupList && groupList.pageLoading) ||
					(typeList[typeIndex].type == 'meal' && mealList && mealList.pageLoading) ||
					(typeList[typeIndex].type == 'appoint' && appointList && appointList.pageLoading)"
		><text class="txt">加载更多...</text></view>
		<view class="loading-txt" 
			v-if="(typeList[typeIndex].type == 'shop' && shopList && shopList.list.length > 0 && shopList.pageComplete) ||
					(typeList[typeIndex].type == 'group' && groupList && groupList.list.length > 0 && groupList.pageComplete) ||
					(typeList[typeIndex].type == 'meal' && mealList && mealList.list.length > 0 && mealList.pageComplete) ||
					(typeList[typeIndex].type == 'appoint' && appointList && appointList.list.length > 0 && appointList.pageComplete)"
		><text class="txt">已经到底啦...</text></view>
		<view class="search-empty" 
			v-if="(typeList[typeIndex].type == 'shop' && shopList && shopList.list.length == 0 && shopList.pageComplete) ||
					(typeList[typeIndex].type == 'group' && groupList && groupList.list.length == 0 && groupList.pageComplete) ||
					(typeList[typeIndex].type == 'meal' && mealList && mealList.list.length == 0 && mealList.pageComplete) ||
					(typeList[typeIndex].type == 'appoint' && appointList && appointList.list.length == 0 && appointList.pageComplete)"
		>
			<image class="img" mode="widthFix" src="../../static/images/search_null.png"></image>
			<view><lang keywords="没有搜索到相关数据" chineseTxt="没有搜索到相关数据"></lang></view>
		</view>
	</view>
</template>

<script>
import common from '../../utils/common.js';
var _this;
var app = getApp()
export default {
	data() {
		return {
			placeholder: '请输入搜索关键字',
			inputValue: '',
			mobile_head_color: '',
			activeStyle: '',
			typeIndex: 0,
			typeList: [{ name: '团购', type: 'group' }, { name: '外卖', type: 'shop' }, { name: '餐饮', type: 'meal' }, { name: '预约', type: 'appoint' }],
			config: '',
			lat: 0,
			lng: 0,
			currency: '¥',
			shopList: '',
			groupList: '',
			mealList: '',
			appointList: '',
			isInput: false,
			isPost: false
		};
	},
	mounted() {
		_this = this;
		common.setMainColor(_this, function(data) {
			if (!app) {
				app = getApp()
			}
			console.log('app.globalData.platSearchKey', app.globalData.platSearchKey);
			if (app.globalData.platSearchKey) {
				_this.inputValue = app.globalData.platSearchKey
			}
			_this.config = data;
			getLocation();
			
			_this.mobile_head_color = data.config.mobile_head_color;
			_this.activeStyle = 'border-color:' + _this.mobile_head_color + ';color:' + _this.mobile_head_color;
			_this.currency = data.config.Currency_symbol
			
			wx.setNavigationBarColor({
				frontColor: '#ffffff',
				backgroundColor: data.config.mobile_head_color
			});
			
			for (let i = 0; i < _this.typeList.length; i++) {
				_this.typeList[i].name = common.changeTxt(_this.typeList[i].name);
				if (data.search_default_type && _this.typeList[i].type == data.search_default_type) {
					let item = _this.typeList.splice(i, 1);
					_this.typeList.splice(0, 0, item[0]);
				}
			}
			console.log('3333333', _this.typeList);
		});
		_this.placeholder = common.changeTxt(_this.placeholder);
	},
	onReachBottom (e) {
		_this.search()
	},
	onUnload () {
		app.globalData.platSearchKey = ''
	},
	methods: {
		sortAppoint (sortStr) {
			if (sortStr == _this.appointList.sortStr) {
				return
			}
			_this.appointList = {
				list: [],
				pageIndex: 1,
				pageLoading: false,
				pageComplete: false,
				sortStr: sortStr
			}
			searchAppoint()
		},
		sortMeal (sortStr) {
			if (sortStr == _this.mealList.sortStr) {
				return
			}
			_this.mealList = {
				list: [],
				pageIndex: 1,
				pageLoading: false,
				pageComplete: false,
				sortStr: sortStr
			}
			searchMeal()
		},
		sortGroup (sortStr) {
			if (sortStr == _this.groupList.sortStr) {
				return
			}
			_this.groupList = {
				list: [],
				pageIndex: 1,
				pageLoading: false,
				pageComplete: false,
				sortStr: sortStr
			}
			searchGroup()
		},
		// 链接跳转
		goUrl (e) {
			console.log('goUrl', e);
			common.parseUrl(e.currentTarget.dataset.url)
		},
		goGoodsDetail(store_id,product_id){
			// m-跳转到指定商品
			console.log(store_id,product_id)
			const scUrl = "../shop_new/goodsDetail/goodsDetail"
			uni.navigateTo({
				url:`${scUrl}?store_id=${store_id}&product_id=${product_id}`
			})
		},
		
		// 跳转到对应店铺
		goShop(shopIndex, goodsIndex) {
		  let store = _this.shopList.list[shopIndex];
		  let url = '/pages/shop_new/shopDetail/shopDetail?store_id=' + store.store_id + '&backgroundColor=' + store.shop_fitment_color + '&frontColor=' + store.shop_fitment_front_color
		  if (goodsIndex) {
		    let goods = store.goods_list[goodsIndex]
		    url = url + '&sort_id=' + goods.sort_id + '&goods_id=' + goods.goods_id
		  }
		  
		  //#ifdef H5
		  if (common.$checkPlat.checkWeixinApp()) {
		  	common.jweixin.miniProgram.navigateTo({ url });
		  }  else {
		  	uni.navigateTo({ url });
		  }
		  //#endif
		  
		  //#ifdef MP-WEIXIN || MP-ALIPAY
			uni.navigateTo({ url });
		   //#endif
		  
		},
		// 查看更多商品
		showMoreGoods(shopIndex) {
			if (!_this.shopList.list[shopIndex].showMore) {
				_this.shopList.list[shopIndex].showMore = true
			} else {
				_this.shopList.list[shopIndex].showMore = false
			}
			_this.$forceUpdate()
		},
		// 点击tap选项卡
		selectType(index) {
			if (index == _this.typeIndex) {
				return
			}
			_this.typeIndex = index;
			let str = _this.typeList[_this.typeIndex].type + 'List'
			if (!_this[str]) {
				_this.search()
			}
		},
		input(e) {
			if (e.detail.value == _this.inputValue) {
				return
			}
			_this.inputValue = e.detail.value
			_this.isInput = true
		},

		clearInput() {
			_this.inputValue = ''
			_this.shopList = ''
			_this.groupList = ''
			_this.mealList = ''
			_this.appointList = ''
		},
		search(isBtn) {
			if (_this.isInput) {
				_this.isInput = false
				_this.shopList = ''
				_this.groupList = ''
				_this.mealList = ''
				_this.appointList = ''
			}
			let type = _this.typeList[_this.typeIndex].type
			let str = _this.typeList[_this.typeIndex].type + 'List'
			if (!_this[str] || (_this[str] && _this[str].pageLoading && _this.isPost == true)) {
				if (type == 'shop') {
					searchShop()
				} else if (type == 'group') {
					searchGroup()
				} else if (type == 'meal') {
					searchMeal()
				} else if (type == 'appoint') {
					searchAppoint()
				}
			}
			app.globalData.platSearchKey = _this.inputValue
			
			// 点击按钮搜索
			if (isBtn && isBtn == 'btn' && _this.inputValue) {
				console.log('缓存搜索关键字')
				let historyList = uni.getStorageSync('plat_search_Key')
				if (!historyList) {
					historyList = []
					historyList.unshift(_this.inputValue)
					uni.setStorageSync('plat_search_Key', JSON.stringify(historyList))
				} else if (historyList.indexOf(_this.inputValue) == -1) {
					historyList = JSON.parse(historyList)
					historyList.unshift(_this.inputValue)
					uni.setStorageSync('plat_search_Key', JSON.stringify(historyList))
				}
				
			}
		}
	}
};

const searchAppoint = () => {
	_this.isPost = false
	let param = {
		w: _this.inputValue,
		sort: _this.appointList ? _this.appointList.sortStr : '',
		page: _this.appointList ? _this.appointList.pageIndex : 1
	}
	common.post('Search&a=appoint', param, (data) => {
		console.log('餐饮搜索结果', data, param);
		let appointList = {
			list: [],
			pageIndex: 1,
			pageLoading: false,
			pageComplete: false,
			sortStr: ''
		};
		if (_this.appointList) {
			appointList = _this.appointList;
		}
		data.group_list.map(item => {
			if (item.search_name.indexOf('font') != -1) {
				item.search_name = item.search_name.replace(/font/g, 'em')
				item.search_name = item.search_name.replace(/<em/g, `<em style="color:${_this.mobile_head_color};font-style:normal;"`)
			}
			return item
		})
		appointList.list = appointList.list.concat(data.group_list);
		if ( appointList.pageIndex < data.totalPage) {
			appointList.pageLoading = true;
			appointList.pageIndex = appointList.pageIndex + 1;
		} else {
			appointList.pageLoading = false;
			appointList.pageComplete = true;
		}
		_this.appointList = appointList
		_this.isPost = true
	}, _this, function(err){
		_this.appointList = {
			list: [],
			pageIndex: 1,
			pageLoading: false,
			pageComplete: true,
			sortStr: ''
		}
		_this.isPost = true
	})
}

const searchMeal = () => {
	_this.isPost = false
	let param = {
		w: _this.inputValue,
		sort: _this.mealList ? _this.mealList.sortStr : '',
		page: _this.mealList ? _this.mealList.pageIndex : 1
	}
	common.post('Search&a=meal', param, (data) => {
		console.log('餐饮搜索结果', data, param);
		let mealList = {
			list: [],
			pageIndex: 1,
			pageLoading: false,
			pageComplete: false,
			sortStr: ''
		};
		if (_this.mealList) {
			mealList = _this.mealList;
		}
		data.group_list.map(item => {
			if (item.search_name.indexOf('font') != -1) {
				item.search_name = item.search_name.replace(/font/g, 'em')
				item.search_name = item.search_name.replace(/<em/g, `<em style="color:${_this.mobile_head_color};font-style:normal;"`)
			}
			return item
		})
		mealList.list = mealList.list.concat(data.group_list);
		if ( mealList.pageIndex < data.totalPage) {
			mealList.pageLoading = true;
			mealList.pageIndex = mealList.pageIndex + 1;
		} else {
			mealList.pageLoading = false;
			mealList.pageComplete = true;
		}
		_this.mealList = mealList
		_this.isPost = true
	}, _this, function(err){
		_this.mealList = {
			list: [],
			pageIndex: 1,
			pageLoading: false,
			pageComplete: true,
			sortStr: ''
		}
		_this.isPost = true
	})
}

const searchGroup = () => {
	_this.isPost = false
	let param = {
		w: _this.inputValue,
		sort: _this.groupList ? _this.groupList.sortStr : '',
		page: _this.groupList ? _this.groupList.pageIndex : 1
	}
	common.post('Search&a=group', param, (data) => {
		console.log('团购搜索结果', data, param);
		let groupList = {
			list: [],
			pageIndex: 1,
			pageLoading: false,
			pageComplete: false,
			sortStr: ''
		};
		if (_this.groupList) {
			groupList = _this.groupList;
		}
		data.group_list.map(item => {
			if (item.group_name.indexOf('em') != -1) {
				item.group_name = item.group_name.replace(/<em/g, `<em style="color:${_this.mobile_head_color};font-style:normal;font-weight:bold;"`)
			}
			return item
		})
		groupList.list = groupList.list.concat(data.group_list);
		if ( groupList.pageIndex < data.totalPage) {
			groupList.pageLoading = true;
			groupList.pageIndex = groupList.pageIndex + 1;
		} else {
			groupList.pageLoading = false;
			groupList.pageComplete = true;
		}
		_this.groupList = groupList
		_this.isPost = true
	}, _this, function(err){
		_this.groupList = {
			list: [],
			pageIndex: 1,
			pageLoading: false,
			pageComplete: true,
			sortStr: ''
		}
		_this.isPost = true
	})
}

const searchShop = () => {
	_this.isPost = false
	let param = {
		lng: _this.lng,
		lat: _this.lat,
		page: _this.shopList ? _this.shopList.pageIndex : 1,
		key: _this.inputValue,
		is_search: true,
		search_type: 'text'
	};
	console.log('搜索参数', param);
	common.post('Shop_new&a=ajax_list', param, data => {
		if (data) {
			console.log('快店搜索结果', data, param);
			let shopList = {
				list: [],
				pageIndex: 1,
				pageLoading: false,
				pageComplete: false
			};
			if (_this.shopList) {
				shopList = _this.shopList;
			}
			
			data.store_list.map(item => {
				if (item.goods_list && item.goods_list.length > 0) {
					item.goods_list.map(goods => {
						if (goods.search_name.indexOf('font') != -1) {
							goods.search_name = goods.search_name.replace(/font/g, 'em')
							goods.search_name = goods.search_name.replace(/<em/g, `<em style="color:${_this.mobile_head_color};font-style:normal;"`)
						}
						return goods
					})
				}
				return item
			})

			shopList.list = shopList.list.concat(data.store_list);
			if (data.has_more) {
				shopList.pageLoading = true;
				shopList.pageIndex = shopList.pageIndex + 1;
			} else {
				shopList.pageLoading = false;
				shopList.pageComplete = true;
			}
			_this.shopList = shopList
		}
		_this.isPost = true
	}, _this, (err) => {
		_this.isPost = true
	});
};

const getLocation = () => {
	var map_type = 'baidu';
	if (_this.config.config.map_config == 'google') {
		map_type = 'wgs84';
	}
	common.locationFun(res => {
		console.log('getLocation完成', res);
		if (res.lat || res.lng) {
			_this.lat = res.lat;
			_this.lng = res.lng;
		}
		_this.search()
	}, _this, map_type);
};
</script>

<style scoped>
.pt5{padding-top: 5px;}	
	
.search-page {height: 100%;box-sizing: border-box;padding-top: 138px;}
.header.fixed {position: fixed;top: 0;left: 0;right: 0;z-index: 999;border-bottom: 1px solid #f2f2f2;}
.search-wrapper {padding: 5px 10px;display: flex;background: #fff;border-bottom: 1px solid #f2f2f2;}
.search-wrapper .search-box {border-radius: 4px;border: 1px solid #f2f2f2;border-radius: 5rpx;font-size: 15px;color: #333;display: flex;align-items: center;padding: 10px 0 10px 10px;box-sizing: border-box;height: 35px;flex: 1;}
.search-wrapper .search-box .input {flex: 1;padding: 0 10px;}
.search-wrapper .search-box .icon-sousuo {color: #999;font-size: 15px;}
.search-wrapper .search-box .icon-cha1 {color: #999;padding: 20rpx;}
.search-wrapper .btn {font-size: 15px;color: #06c1ae;height: 35px;line-height: 35px;margin-left: 10px;}
.type-list {display: flex;background: #fff;}
.type-list .item {flex: 1;text-align: center;color: #7b7b7b;font-size: 14px;padding: 10px 0;position: relative;border-bottom: 2px solid #fff;box-sizing: border-box;}
.type-list .item:after {content: '';position: absolute;top: 10px;bottom: 10px;right: 0;width: 1px;background: #f2f2f2;}
.type-list .item:last-child:after {width: 0;}

.shop-item {display: flex;margin-bottom: 10px;background: #fff;padding: 10px;box-sizing: border-box;position: relative;}
.shop-item:last-child {margin-bottom: 0;}
.shop-item .close-mask {position: absolute;top: 0;left: 0;right: 0;bottom: 0;background: rgba(255, 255, 255, 0.5);z-index: 5;}
.shop-item .img-wrapper{width:85px;height:60px;margin-right: 10px;flex-shrink: 0;position: relative;}
.shop-item .img{height: 100%;width: 100%;display: block;border-radius: 2px;}
.shop-item .img-wrapper .close {position: absolute;bottom: 0;left: 0;right: 0;background: rgba(252, 251, 251, 0.8);color: #555;text-align: center;font-size: 13px;}
.shop-item .img-wrapper .num {position: absolute;bottom: -3px;right: -3px;background: linear-gradient(to right, #ff9867, #ff5f45);width: 18px;height: 18px;color: #fff;text-align: center;line-height: 18px;border-radius: 50%;font-size: 14px;}
.shop-item .img-wrapper .tag {position: absolute;top: 0;right: 0;background: #ffce59;color: #aa8023;font-size: 10px;padding: 2px;font-weight: bold;}
.shop-item .content-box {width: calc(100% - 95px);}
.shop-item .name, .result-list .item .info {display: flex;justify-content: space-between;align-items: center;}
.shop-item .name {font-size: 16px;font-weight: bold;white-space: nowrap;text-overflow: ellipsis;overflow: hidden;padding-bottom: 3px;}
.shop-item .self-support {font-size: 11px;color: #fff;background: #fc3e2d;padding: 0 4px;border-radius: 2px;margin-right: 5px;white-space: nowrap;vertical-align: middle;display: inline-block;margin-top: -3px;line-height: 1.6;}
.shop-item .line {display: flex;align-items: center;justify-content: space-between;font-size: 12px;color: #666;}
.shop-item .text-overflow {white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
.shop-item .line .tag {white-space: nowrap;}
.shop-item .line .score-box {display: flex;align-items: center;line-height: 20px;}
.shop-item .line .score-box .icon-star {color: #ffc900;font-size: 12px;margin-right: 5px;}
.shop-item .line .score {color: #333;margin-right: 10px;}
.shop-item .line .score-box wux-rater {margin-bottom: 2px;white-space: nowrap;}
.shop-item .line .gather-box {float: right;}
.shop-item .line .icon-line {font-size: 14px;}
.shop-item .line .express-box .other,
.shop-item .line .express-box .self {margin-left: 5px;font-size: 11px;border-radius: 2px;}
.shop-item .line .express-box .other {background: #06c1ae;color: #fff;padding: 2px 3px;}
.shop-item .line .express-box .self {color: #06c1ae;border: 1rpx solid #c5f3ef;padding: 1px 2px;}
.shop-item .line .tag {border-radius: 2px;margin-right: 5px;padding: 0 2px;}
.shop-item .sale-box .iconfont {padding: 0 5px;}
.shop-item .goods {margin-top: 10px;display: flex;}
.shop-item .goods image {width: 70px;height: 70px;margin-right: 5px;border: 1rpx solid #f8f8f8;}
.shop-item .goods .desc {width: calc(100% - 75px);display: flex;flex-direction: column;justify-content: space-between;}
.shop-item .goods .desc .name {font-size: 14px;color: #333;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;width: 100%;display: inline-block;margin-bottom: 0;}
.shop-item .goods .desc .num {font-size: 12px;color: #666;}
.shop-item .goods .desc .price {font-size: 16px;color: #e23321;}
.shop-item .goods .desc .price .unit{font-weight:normal;font-size:14px;margin-left:2px;}
.shop-item .goods .desc .price .discount_info{font-weight: normal;font-size: 12px;}
.shop-item .goods .desc .price .del-line{font-size: 12px;text-decoration: line-through;color: #999;font-weight: normal;margin-left: 6px;}

.shop-item .show-more {font-size: 14px;color: #333;margin-top: 10px;}
.shop-item .goods-info .active {height: 165px;overflow: hidden;}
.shop-item .goods-info .active-more {height: auto;overflow: hidden;}
/* 发票 */
.invoice{color: #06c1ae; border: 1rpx solid #c5f3ef;}
/* 平台首单优惠 平台优惠 */
.system_newuser, .system_minus{color: #aa8023; border: 1rpx solid #f3e5c6;}  
/* 打折 部分商品限时优惠  部分商品分类折扣优惠 配送费优惠 店铺首单优惠 店铺优惠 */
.discount, .isdiscountgoods, .isdiscountsort, .delivery, .newuser, .minus{color: #ff3e4a;border: 1rpx solid #fce5e7;}
.discount-icon{display: flex;flex-wrap: wrap;margin-top: 10px;}
.discount-icon>view{margin-right: 5px;margin-bottom: 5px;font-size: 11px;padding: 1px 3px;border-radius: 2px;}
.discount-icon .self{color: #06c1ae; border: 1rpx solid #c5f3ef;}

.ellipsis2{text-overflow: ellipsis !important;display: -webkit-box !important;-webkit-line-clamp: 2 !important;-webkit-box-orient: vertical !important;overflow: hidden !important;}
.shop-item .price{font-size: 18px;font-weight: bold;color: #06c1ae;position: relative;top: 1px;}
.shop-item  .wx-discount{color: #f58300; border: 1rpx solid #f58300;margin-left: 5px;position: relative;top: -2px;padding: 0 2px;}

.group-list .shop-item .old-price{text-decoration: line-through;margin-left: 5px;color: #999;}
.group-list .discount-icon{margin-top: 5px;}
.group-list .discount-icon .icon{font-size: 12px;margin-right: 5px;color: #06c1ae; border: 1rpx solid #c5f3ef;padding: 2px 5px;border-radius: 5px;}

.group-list .img-wrapper, .appoint-list .img-wrapper{width:90px;height:50px;}
.meal-list .img-wrapper{width:90px;height:54px;}


.loading-txt{text-align: center;padding: 10px 0;}
.loading-txt .txt{color: #999999;font-size: 12px;}
.search-empty{height: -webkit-calc(100% - 88px);height: calc(100% - 88px);display: flex;justify-content: center;align-items: center;flex-direction: column;color: #999;font-size: 14px;}
.search-empty .img{width: 100px;height: 100px;margin-bottom: 10px;}

/* 排序按钮 */
.sort-list{background: #f4f4f4;display: flex;border-bottom: 1px solid #f2f2f2;color: #7b7b7b;font-size: 14px;position: fixed;top: 88px;left: 0;right: 0;z-index: 99;}
.sort-list .sort-item{flex: 1;text-align: center;padding: 10px 0;background: #fff;}
.sort-list .sort-item .iconfont{vertical-align: middle;}
</style>
